<template>
  <div class="h-screen bg-gradient-to-b from-blue-50 to-white flex flex-col overflow-hidden">
    <!-- 头部标题区域 -->
    <div class="text-center pt-48 pb-8 flex-shrink-0">
      <h1 class="text-5xl font-bold text-blue-600 mb-4">
        欢迎使用儿童腺样体智能检测平台
      </h1>
      <p class="text-xl text-gray-600 px-4">
        为您的诊断提供高效，精准，可靠的辅助
      </p>
    </div>

    <!-- 快速开始按钮区域 -->
    <div class="text-center pt-48 pb-12 flex-shrink-0">
      <button @click="quickStart"
        class="bg-blue-600 hover:bg-blue-700 text-white font-bold py-6 px-20 rounded-full text-2xl transition-colors duration-300 shadow-xl hover:shadow-2xl transform hover:scale-105">
        快速开始
      </button>
    </div>
  </div>
</template>

<script>
export default {
  name: 'HomePage',
  methods: {
    // 快速开始功能
    quickStart() {
      // 这里可以添加快速开始的逻辑
      console.log('快速开始功能')
      // 导航到图片上传界面
      this.$router.push('/main/uploadpicture')
    }
  }
}
</script>

<style scoped>
/* 使用 Tailwind CSS，无需额外样式 */
</style>